<template>
  <view>
      <view  @tap="toSellingDetail(sell.houseId)">
            <view class="uni-flex uni-row">
                <view class="text uni-flex" style="width: 300rpx;height: 300rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;">
                    <image class="image" :src='sell.houseSurfaceplot'></image>
                </view>
                <view class="uni-flex uni-column" style="-webkit-flex: 1;flex: 1;-webkit-justify-content: space-between;justify-content: space-between;">
                    <view class="text" style="height: 100rpx;text-align: left;padding-left: 10rpx;padding-top: 10rpx;">
                        <text class="heading" v-text="sell.sellHeading"></text>
                    </view>
                    <view class="uni-flex uni-row" style="height:50rpx">
                        <view class="text" style="wdith:60rpx">{{sell.houseArea}}m²</view>
                        <view class="text" style="wdith:60rpx" v-text="sell.houseDirection"></view>
                        <view class="text" style="wdith:60rpx" v-text="sell.houseEstate"></view>
                    </view>
                    <view class="uni-flex uni-row">
                        <view class="text" style="-webkit-flex: 1;flex: 1;">
                            <text class="price">{{sell.sellPrice}}万</text>
                        </view>
                        <view class="text" style="-webkit-flex: 1;flex: 1;">
                            <text class="unitprice">{{(sell.sellPrice*10000/sell.houseArea).toFixed(0)}}元/平</text>
                        </view>
                    </view>
                </view>
            </view>
        </view>
  </view>
</template>

<script>
export default {
    props:["sell"],
    data() {
        return {
           
        }
    },
    methods:{
        toSellingDetail(houseId){
            uni.navigateTo({
				url:'/pages/common/sellhouse-detail?id='+houseId
			})
        }
    }
}
</script>

<style>
	.image{
		width: 300rpx;
		height: 300rpx;
		border-radius:15rpx;
	} 

	.flex-item-V {
		width: 100%;
		height: 150rpx;
		text-align: center;
		line-height: 150rpx;
	}

	.text {
		margin: 15rpx 10rpx;
		background-color: #ffffff;
		height: 70rpx;
		line-height: 70rpx;
		color: rgb(22, 21, 21);
		font-size: 30rpx;
	}

	.heading{
		padding: 0rpx;
		text-align: left;
		margin: 0rpx 0rpx;
		color: rgb(0, 0, 0);
		text-align:right;
		font-size: 35rpx;
		font-weight:bold;
		top:0%;
	}

	.price{
		color: rgb(255, 0, 0);
		font-weight: bold;
		text-align: left;
		font-size: 45rpx;
	}

    .unitprice{
        color: rgb(139, 139, 139);
        text-align: left;
        font-size: 25rpx;
    }
</style>